import { ProTable, type ProColumns } from '@/components/Pro';

import { pcsControllerGetPcsPageDatas } from '@/services/ess/devicePcs';
import { DATABASE_TYPE_ENUM, fetchDictInfo } from '@/utils';
import { useModel } from '@@/exports';
import dayjs from 'dayjs';
import React, { useEffect, useState } from 'react';
import { useIntl } from 'umi';
const HistoryData: React.FC = () => {
  const intl = useIntl();
  const { initialState } = useModel('@@initialState');
  const [workStateOptions, setWorkStateOptions] = useState([]);
  const columns: ProColumns<any>[] = [
    {
      title: intl.formatMessage({ id: 'data.s/N' }),
      dataIndex: 'pageIndex',
      key: 'pageIndex',
      hideInSearch: true,
      fixed: 'left',
      width: 60,
    },
    {
      title: intl.formatMessage({ id: 'data.acquisitionTime' }),
      dataIndex: 'collectTime',
      key: 'collectTime',
      valueType: 'dateTimeRange',
      initialValue: [dayjs().startOf('day'), dayjs()],
      fixed: 'left',
      width: 100,
      render: (_, record) => {
        return <span>{record.collectTime}</span>;
      },
    },
    {
      title: intl.formatMessage({ id: 'data.reportingTime' }),
      dataIndex: 'reportTime',
      key: 'reportTime',
      valueType: 'dateTimeRange',
      initialValue: [dayjs().startOf('day'), dayjs()],

      fixed: 'left',
      width: 100,
      render: (_, record) => {
        return <span>{record.reportTime}</span>;
      },
    },
    {
      title: intl.formatMessage({ id: 'alarmManagement.alarmList.deviceType' }),
      dataIndex: 'product',
      key: 'product',
      hideInSearch: true,
      width: 100,
    },
    {
      title: intl.formatMessage({ id: 'data.deviceFactory' }),
      dataIndex: 'producer',
      key: 'producer',
      hideInSearch: true,
      width: 100,
    },
    {
      title: intl.formatMessage({ id: 'data.deviceID' }),
      dataIndex: 'pcsCode',
      hideInSearch: true,
      width: 90,
    },
    {
      title: intl.formatMessage({ id: 'data.runningStatus' }),
      dataIndex: 'workState',
      hideInSearch: true,
      valueType: 'select',
      request: () => fetchDictInfo(DATABASE_TYPE_ENUM.PCS_STATUS),
      width: 100,
    },
    {
      title: intl.formatMessage({ id: 'data.gcbStatus' }),
      dataIndex: 'stateInfo',
      hideInSearch: true,
      valueType: 'select',
      request: () => fetchDictInfo(DATABASE_TYPE_ENUM.BREAKER_STATUS),
      width: 120,
    },
    {
      title: intl.formatMessage({ id: 'data.gcbFault' }),
      dataIndex: 'faultInfo',
      hideInSearch: true,
      valueType: 'select',
      request: () => fetchDictInfo(DATABASE_TYPE_ENUM.BREAKER_BREAKDOWN),
      width: 120,
    },
    {
      title: intl.formatMessage({ id: 'data.onlineStatus' }),
      dataIndex: 'onlineState',
      hideInSearch: true,
      width: 100,
      render: (_, record) => {
        const text = workStateOptions.find((item) => {
          return Number(item.value) === record.onlineState;
        })?.label;
        return <span>{text}</span>;
      },
    },
    {
      title: intl.formatMessage({ id: 'data.igbtTempa' }),
      dataIndex: 'igbta',
      hideInSearch: true,
      width: 100,
    },
    {
      title: intl.formatMessage({ id: 'data.igbtTempb' }),
      dataIndex: 'igbtb',
      hideInSearch: true,
      width: 100,
    },
    {
      title: intl.formatMessage({ id: 'data.igbtTempc' }),
      dataIndex: 'igbtc',
      hideInSearch: true,
      width: 100,
    },
    {
      title: intl.formatMessage({ id: 'data.ua' }),
      dataIndex: 'ua',
      hideInSearch: true,
      width: 100,
    },
    {
      title: intl.formatMessage({ id: 'data.ub' }),
      dataIndex: 'ub',
      hideInSearch: true,
      width: 100,
    },
    {
      title: intl.formatMessage({ id: 'data.uc' }),
      dataIndex: 'uc',
      hideInSearch: true,
      width: 100,
    },
    {
      title: intl.formatMessage({ id: 'data.ia' }),
      dataIndex: 'ia',
      hideInSearch: true,
      width: 100,
    },
    {
      title: intl.formatMessage({ id: 'data.ib' }),
      dataIndex: 'ib',
      hideInSearch: true,
      width: 100,
    },
    {
      title: intl.formatMessage({ id: 'data.ic' }),
      dataIndex: 'ic',
      hideInSearch: true,
      width: 100,
    },
    {
      title: intl.formatMessage({ id: 'data.activePowerKw' }),
      dataIndex: 'activePower',
      hideInSearch: true,
      width: 120,
    },
    {
      title: intl.formatMessage({ id: 'data.reactivePowerKvar' }),
      dataIndex: 'reactivePower',
      hideInSearch: true,
      width: 120,
    },
    {
      title: intl.formatMessage({ id: 'data.apparentPowerKva' }),
      dataIndex: 'apparentPower',
      hideInSearch: true,
      width: 120,
    },
    {
      title: intl.formatMessage({ id: 'data.powerFactor' }),
      dataIndex: 'powerFactor',
      hideInSearch: true,
      width: 100,
    },
    {
      title: intl.formatMessage({ id: 'data.gridFrequency' }),
      dataIndex: 'gridFreq',
      hideInSearch: true,
      width: 120,
    },
  ];
  const scroll = {
    x: 'max-content',
  };
  useEffect(() => {
    Promise.all([fetchDictInfo(DATABASE_TYPE_ENUM.ONLINE_STATUS)]).then((res) => {
      setWorkStateOptions(res[0]);
    });
  }, []);
  return (
    <div style={{ width: '100' }}>
      <ProTable
        rowKey={'pageIndex'}
        columns={columns}
        scroll={scroll}
        request={async (value) => {
          const params = {
            current: value.current,
            pageSize: value.pageSize,
            stationId: initialState?.stationId,
            collectStartTime: value.collectTime ? value.collectTime[0] : undefined,
            collectEndTime: value.collectTime ? value.collectTime[1] : undefined,
            reportStartTime: value.reportTime ? value.reportTime[0] : undefined,
            reportEndTime: value.reportTime ? value.reportTime[1] : undefined,
          };
          return await pcsControllerGetPcsPageDatas(params);
        }}
        toolBarRender={() => []}
        customToolBarClass="global-tabs-custom-tools"
      ></ProTable>
    </div>
  );
};

export default HistoryData;
